How To Center a Div With CSS The Easy Way

When you look at any commonly found site on the net, you'll notice that most sites have some things in common. The content of the page is perfectly in the center of your browser window.

 How is this possible, how can this be done?

There are a few steps that can be taken into consideration to achieve this basic, yet very helpful technique.

For starters.

1. Create the class that will be used to center divs. This is done in your CSS.

.div-center {
   width: 1000px;
   margin:  0 auto;
   background: #ccc;
}

2. The class MUST always have a width in order for the CSS to know how to Center the object. If a width is not given, the CSS has no idea how wide the div is in order to center it.

3. You can however, have a class that does not have a fixed width, but still center itself in your browser window, by using, min-width and max-width. These two will play a huge role when someone is using a 10" monitor or a 32" monitor.

4. Now that you've created the CSS for your centered div, you must now create the div in your html.

<div class="div-center">

   Content that needs centering goes in here, div, spans, a whole site!

</div>

I hope you've enjoyed this short introduction to centering divs in a browser window.

How To Get CSS3 To Work On IE6, IE7 and IE8

If only border-radius and box-shadow could work on IE6 to IE 8....

Well now it can be done! It's just a simple script you add to your code and bing bala boom, your IE6 browser now has the capabilities to use styling like border-radius and box-shadow and much more!

Here's what you need to do!

1. Download this package and copy it to your sites directory. For example js, images or css.
2. Add this line to all classes or ids that will be using CSS3.
3. behavior: url(path/to/PIE.htc); This activates the magic.

Here's a example.

.box  {
   border-radius: 10px;
   box-shadow: 0 0 10px #000;
   behavior: url(path/to/PIE.htc);
}

It's that simple, expect a more revised version of this blog post.

Importance Of W3 Standards

With the burgeoning popularity of the internet, new developmental tools are created daily. With these tools come new challenges, marketing, design, cross-browser transitions, etc. All of these can be a daunting task for those web gurus who aren't well-versed in the W3 Standards. W3 (w3schools.com) is a resource for webmasters and programmers who want the most for their viewing public.

There are numerous technologies used by programmers (ASP, PHP, and Javascript to name a few), but this article will focus solely on XHTML and CSS. W3 has a set of standards for both of these technologies, and making a website W3-compliant ensures that most all viewers will see the site exactly the same way (no matter what browser they're using). Validation also helps with Search Engine Optimization (SEO) because clean code means easier search-engine spidering. Cascading Style Sheets, or CSS, is a technology often used in sites with many pages to make aesthetic changes easier. The style sheet is an exterior file that runs interdependently with the HTML (or outputted HTML) of a site.

The style sheet serves as a template for the entire site's color and font schemes, while also controlling borders, sizes, and more. Being able to edit a single file, instead of 100s of changes in many files saves time and precious web design dollars. Validation is imperative to get the most out of a website. That is, a user can upload or copy-and-paste their CSS file to the W3 site, and they'll be given a list of any errors it contains.Another of the technologies becoming more popular is Extensible Hypertext Markup Language, or XHTML.

 XHTML is an extension of HTML 4.0, and, while in its infancy, has become quite prevalent. XHTML conforms to standards moreso than HTML. As such, it is more search-engine and user-friendly:XHTML documents conform to XML. XML Tools can double as XHTML tools.XHTML is an extension of HTML 4.0. It is more user-friendly and streamlined than HTML.XHTML is a combination of HTML and XML in that it can run scripts and applets that use both the HTML and XML DOM (Document Object Model)
As XHTML grows, XHTML 1.0 documents will be able to interoperate among other XHTML documents making it a more browser transitional language.

To conclude, using the standards of web development lined out by the W3 is imperative for users to get the most out of a site. Often, making a webpage W3-compliant is the first step of SEO, a marketing tool to get the most out of your advertising dollar. Validation is easy, and can be completed if a user has a basic knowledge of HTML-editing and FTP (File Transfer Protocol). Using these tools, coupled with the set of W3 standards can save a lot of money and help the site's overall functionality.

What is XHTML?

We have all heard of HTML. HTML stands for Hypertext Markup Language. What is a hypertext markup language, you ask? It is a language for specifying how certain text should appear. When you design a web page, you want certain content or text to be displayed in a specific way. You may want some text to appear in bold or italics, while other text you may want to display larger or in color.

HTML is not the only type of markup language. There are markup languages that apply to other types of applications, such as word processing or other software applications. However, HTML was by far the most important markup language ever created, as it became the standard for displaying information on what is now known as the world wide web, or internet.

However, HTML is not the only markup language being used on the internet today. Another, better version of HTML evolved as programmers began to realize that HTML was innately flawed in a variety of ways.

By 1999, a new specification was written in a language called XML, which forms the basis for XHTML. The World Wide Web Consortium says the following about XHTML:

- The Extensible HyperText Markup Language (XHTML) is a family of current and future document types and modules that reproduce, subset, and extend HTML, reformulated in XML. XHTML family document types are all XML-based, and ultimately are designed to work in conjunction with XML-based user agents. XHTML is the successor of HTML, and a series of specifications has been developed for XHTML -

XHTML is what is known as a meta-language, which is a language for defining a markup language. To put it simply, SGML (Standard Generalized Markup Language) is the basis for HTML. XML is a more refined subset of SGML, and forms the basis for XHTML. On the whole, XHTML allows for more flexibility than HTML.

XHTML was developed for two reasons: (1) to try to create a language that could more effectively convey the meaning of a particular webpage to a computer, and (2) to create a layout for webpages that would be universally understood by browsers running on different platforms or on different types of screens, whether it be a PC platform with a standard 800 X 600 monitor, a laptop, a cell phone, or any other device.

So, to all you web designers out there, it is probably time to start designing your most important web pages in XHTML. As almost every electronic device on the market is now equipped with internet access, it is important to use a versatile programming language like XHTML so that your web pages can be viewed and properly formatted across a wide variety of platforms.